<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>电灯开关案例</title>
</head>
<body>
<img id="light" src="../../img/off.gif">
<script>
    //获取图片对象
    //绑定单击事件
    //每次点击切换图片
    //灯是开的，切换为off
    //等时关的，切换为on
    //使用标记flag完成
    var light = document.getElementById("light");
    var flag=false;//flag为false，代表灯是灭的
    light.onclick=function (){
        if(flag){
            //flag为true，代表灯是开着的
            light.src="../../img/off.gif";
            flag=false;
        }else{
            //flag为false，代表灯是灭的
            light.src="../../img/on.gif";
            flag=true;
        }
    }

</script>
</body>
</html>